* {
    margin: 0;
    padding: 0;
}
.px2rem(@name, @px) {
    @{name}: @px / 75 * 1rem;
}
.flexbox {
    display: flex;
    display: -webkit-flex;
}
li {
    list-style: none;
}
a {
    text-decoration: none;
}
body,
html {
    width: 100%;
    height: 100%;
}
header{
    .flexbox();
    justify-content: center;
    align-items: center;
    .px2rem(line-height, 110);
    .px2rem(font-size, 54); 
    color: white;
    background: #aa0202;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 2;
    .left{
     .px2rem(width, 90);
     .px2rem(padding-left, 22); 
     img{
        .px2rem(width, 34); 
        .px2rem(height, 49); 
     }
    }
    .center{
        flex: 1;
        text-align: center;  
    }
    .right{
         .px2rem(width, 90);     
    }
}



footer{
    .px2rem(font-size,0);
    position: fixed;
    left: 0;
    bottom: 0;
     width: 100%;
     .px2rem(font-size,35);
    ul{
    .flexbox();      
     .px2rem(height,128);
     background: #000;
     width: 100%;
    }
    li{
        flex-grow:1 ;
        .px2rem(width, 1);
       .flexbox(); 
        justify-content: center;
        align-items: center;
        a{
            .flexbox(); 
            flex-direction: column;
            justify-content: center;
            align-items: center;
            color: #fff;
            img{
            display: block;
            .px2rem(width,90);
            .px2rem(height,69);
        }
        }
        .curr{
            text-decoration: none;
            background: red;
            .px2rem(padding-top,5);
            .px2rem(padding-left,48);
            .px2rem(padding-right,48);
            .px2rem(padding-bottom,5);
        }
        
    }
}
.bg,.bga{
    
    .px2rem(height,17);
    width: 100%;
    img{
       .flexbox(); 
            align-items: center;
            justify-content: center; 
            width: 100%;
            
           
    }
}
.bg{
     position: fixed;
     .px2rem(top,110);
}
.bga{
     position: fixed;
     .px2rem(bottom,127);
}

